<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>编辑产品信息</title>
    <link rel="stylesheet" type="text/css" href="../../lib/pagination/style/pagination.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/base.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/news/center.css"/>
    <link rel="stylesheet" href="/lib/laydate/need/laydate.css">
    <script type="text/javascript" src="../../js/news/jquery-1.9.1.js"></script>
    <script src="/lib/laydate/laydate.js"></script>
    <script type="text/javascript" src="/js/base/tablePage.js"></script>
    <script src="../../js/news/page.js"></script>
    <script src="../../js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../lib/pagination/js/jquery.pagination.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../lib/layer/layer.js?20201106"></script>
    <script src="../../lib/laydate/laydate.js"></script>
    <script src="../js/sys/citys.js" type="text/javascript" charset="utf-8"></script>
    <style>
        * {font-family: "Microsoft Yahei" !important;}
        b{
            color: red;
        }
        .head_title{
            margin-top: 10px;
            height: 40px;
            position: relative;
        }
        .head_title .title{
            margin-left: 22px;
        }
        .head_title span{
            float: none;
            font-size: 22px;
            color: #333;
            display: inline-block;
            margin-left: 10px;
            vertical-align: middle;
            margin-top: -6px;
        }
        .saveBtn{
            display: block;
            float: left;
            background: url(../img/confirm.png) no-repeat;
            border: none;
            width: 70px;
            height: 29px;
            line-height: 29px;
            margin-left: 10px;
            cursor: pointer;
        }
        .resetBtn {
            display: block;
            float: left;
            background: url(../img/news/new_filling.png) no-repeat;
            border: none;
            width: 70px;
            height: 29px;
            line-height: 29px;
            margin-left: 10px;
            cursor: pointer;
        }
        .div_Btn{
            position: absolute;
            left: 43%;
            margin: 10px auto;
        }
        select{
            width: 250px;
            height: 30px;
        }
        .newTbale tr td {
            border-right: #ccc 1px solid;
            padding: 5px 30px;
        }
        input[type="text"]{
            width: 250px;
            height: 30px;
        }
        .newTbale {
            width: 85%;
            margin: 0px auto;
        }
        table {
            border-collapse: collapse;
            border-spacing: 0;
        }
        #ajaxforms{
            position: relative;
        }
    </style>
    <link rel="stylesheet" type="text/css" href="/css/commonTheme/${sessionScope.InterfaceModel}/commonTheme.css"/>
</head>
<body>
<!--head开始-->
<div class="head_title">
    <div class="title">
        <img src="/img/commonTheme/${sessionScope.InterfaceModel}/flow_run_title.png"><span style="">编辑产品信息</span>
    </div>
</div>
<div id="pagediv">
    <form id="ajaxforms" action="/product/updateProduct">
        <table class="newTbale">
            <tr>
                <td>产品名称:</td>
                <td><input type="text" name="productName"/>
                <td>产品类型:</td>
                <td><input type="text" name="type"/></td>
            </tr>
            <tr>
                <td>提供商名称:</td>
               <td>
                    <select name="supplierId">
                        <option value="">选择产品提供商</option>
                    </select>
                </td>
                <td>计量单位:</td>
                <td><input type="text" name="meteringUnit"/></td>
            </tr>
            <tr>
                <td>成本价:</td>
                <td><input type="text" name="cost" maxlength="8"/></td>
                <td>销售价:</td>
                <td><input type="text" name="price" maxlength="8"/></td>
            </tr>
            <tr>
                <td>产品库存:</td>
                <td><input type="text" name="stock" maxlength="8"/></td>
                <td>规格型号:</td>
                <td><input type="text" name="specification"/></td>
            </tr>
            <tr>
                <td>创建人:</td>
                <td><input type="text" name="creator" disabled="true"/></td>
                <td>创建时间:</td>
                <td><input type="text" name="createTime" disabled="true"/></td>
            </tr>
        </table>
    </form>
</div>
<div class="div_Btn">
    <div class="saveBtn">
        <span  onclick="ajaxforms()" style="margin-left: 32px;">保存</span>
    </div>
    <div class="resetBtn" onclick="javascript:window.location.href='/product/showProduct';">
        <span  style="margin-left: 32px;" >返回</span>
    </div>
</div>
</body>
<script>
    var getRequestObj=$.GetRequest();
    // 下拉框动态获取提供商的
    $(function (){
        $.ajax({
            url: "/supplier/selectByCount",
            type:'get',
            dataType:"JSON",
            success:function(data){
                var str='<option value="">选择产品提供商</option>';
                for (var i=0;i<data.obj.length;i++){
                    str += '<option value="'+data.obj[i].supplierId+'">'+data.obj[i].supplierName+'</option>'
                }
                $('[name="supplierId"]').html(str);
            }
        })
    })
    //修改产品信息
    function  ajaxforms() {
        $.ajax({
            url: '/product/updateProductById',
            type: 'post',
            dataType: 'json',
            data: $('#ajaxforms').serialize()+'&productId='+getRequestObj.productId,
            success: function (data) {
                if(data.flag){
                    layer.open({
                        type: 1
                        , offset: type //具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
                        , id: 'layerDemo' + type //防止重复弹出
                        , content: '<div style="padding: 20px 100px;">' + "修改成功!" + '</div>'
                        , btn: '确定'
                        , btnAlign: 'c' //按钮居中
                        , shade: 0 //不显示遮罩
                        , yes: function () {
                            layer.closeAll();
                            window.location.href='/product/showProduct'
                        }
                    });
                }else{
                    layer.open({
                        type: 1
                        , offset: type //具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
                        , id: 'layerDemo' + type //防止重复弹出
                        , content: '<div style="padding: 20px 100px;">' + "修改失败!" + '</div>'
                        , btn: '确定'
                        , btnAlign: 'c' //按钮居中
                        , shade: 0 //不显示遮罩
                        , yes: function () {
                            layer.closeAll();

                        }
                    });
                }
            },
            error: function (data) {
                layer.open({
                    type: 1
                    , offset: type //具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
                    , id: 'layerDemo' + type //防止重复弹出
                    , content: '<div style="padding: 20px 100px;">' + "修改失败!" + '</div>'
                    , btn: '确定'
                    , btnAlign: 'c' //按钮居中
                    , shade: 0 //不显示遮罩
                    , yes: function () {
                        layer.closeAll();

                    }
                });
            }
        })
    }
    // 数据回显
    $(function () {
        $.ajax({
            url:'/product/dataDetail',
            data:{
                productId:getRequestObj.productId
            },
            type: 'get',
            dataType: 'json',
            success:function (json) {
                if (json.flag) {
                    $('[name="productName"]').val(json.object.productName);
                    $('[name="type"]').val(json.object.type);
                    $('[name="supplierId"]').val(json.object.supplierId);
                    $('[name="meteringUnit"]').val(json.object.meteringUnit);
                    $('[name="cost"]').val(json.object.cost);
                    $('[name="price"]').val(json.object.price);
                    $('[name="stock"]').val(json.object.stock);
                    $('[name="specification"]').val(json.object.specification);
                    $('[name="creator"]').val(json.object.creator);
                    $('[name="createTime"]').val(json.object.createTime);
                }
            }
        })
    })
</script>

</html>
